/*
 * @Author: puyue 10857397+puyue123@user.noreply.gitee.com
 * @Date: 2022-08-11 10:16:12
 * @LastEditors: puyue 10857397+puyue123@user.noreply.gitee.com
 * @LastEditTime: 2022-08-17 11:12:25
 * @FilePath: \bpm-management-system\src\component\procurementmanage\Caigoujihuaguanli.js
 * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
 */
import React from 'react'
import { Button, Form, Input, Select, Table, Space } from 'antd';
import './Caigoujihuaguanli.less'


const columns = [
  {
    title: '序号',
    // width:60,
    dataIndex: 'serial',
    key: 'serial',
    align: 'center',
    fixed:'left'
  },
  {
    title: '标题',
    // width:200,
    dataIndex: 'title',
    key: 'title',
    align:"center"
  },
  {
    title: '计划进场时间',
    // width:120,
    dataIndex: 'plantime',
    key: 'plantime',
    align:"center"
  },
  {
    title: '是否紧急',
    // width:200,
    dataIndex: 'urgent',
    key: 'urgent',
    align:"center"
  },
  {
    title: '所属项目',
    // width:80,
    dataIndex: 'project',
    key: 'project',
    align:"center"
  },
  {
    title: '创建人',
    // width:80,
    dataIndex: 'creater',
    key: 'creater',
    align:"center"
  },
  {
    title: '创建日期',
    // width:120,
    dataIndex: 'date',
    key: 'date',
    align:"center"
  },
  {
    title: '操作',
    // width:150,
    key: 'operation',
    render: () => (
      <Space size="middle">
        <a href='###'>详情</a>
      </Space>
    ),
    align: "center",
    fixed:'right'
  },
];
const data = [
  {
    key: '1',
    serial: 1,
    title: '苏州地铁项目第一批采购计划',
    plantime: '2020-11-12',
    urgent: '是',
    project: '苏州地铁项目',
    creater: 'Admin',
    date:'2020-11-12  15：00'
  },
  {
    key: '2',
    serial: 2,
    title: '苏州地铁项目第二批采购计划',
    plantime: '2020-11-12',
    urgent: '否',
    project: '苏州地铁项目',
    creater: 'Admin',
    date:'2020-11-12  17：00'
  },
  {
    key: '3',
    serial: 3,
    title: '苏州地铁项目第三批采购计划',
    plantime: '2020-11-12',
    urgent: '是',
    project: '苏州地铁项目',
    creater: 'Admin',
    date:'2020-11-12  15：00'
  },
  {
    key: '4',
    serial: 4,
    title: '苏州地铁项目第一批采购计划',
    plantime: '2020-11-12',
    urgent: '是',
    project: '苏州地铁项目',
    creater: 'Alex Yang',
    date:'2020-11-12  15：00'
  },
  {
    key: '5',
    serial: 5,
    title: '苏州地铁项目第一批采购计划',
    plantime: '2020-11-12',
    urgent: '是',
    project: '苏州地铁项目',
    creater: 'Alex Yang',
    date:'2020-11-12  15：00'
  },
];

const { Option } = Select;
export default function Caigoujihuaguanli() {
  return (
    <div>
      <div className='content'>
        <Form
          className='caigoubox'
          labelCol={{
            span: 8,
          }}
          wrapperCol={{
            span: 16,
          }}
          initialValues={{
            remember: true,
          }}
          autoComplete="off"
        >
          <Form.Item label="标题" labelCol={{
            span: 9,
            offset: 30,
          }}>
            <Input placeholder="请输入" />
          </Form.Item>
          <Form.Item label="计划进场时间" labelCol={{
            span: 9,
            offset: 30,
          }}>
            <Input type="date"/>
          </Form.Item>
          <Form.Item label="是否紧急" labelCol={{
            span: 9,
            offset: 30,
          }}>
            <Select placeholder="请选择">
              <Option value="china">China</Option>
              <Option value="usa">U.S.A</Option>
            </Select>
          </Form.Item>
          <Form.Item label="所属项目" labelCol={{
            span: 9,
            offset: 30,
          }}>
            <Input placeholder="请输入" />
          </Form.Item>
          <Form.Item label="创建人" labelCol={{
            span: 9,
            offset: 30,
          }}>
            <Input placeholder="请输入" />
          </Form.Item>
          <Form.Item label="创建时间" labelCol={{
            span: 9,
            offset: 30,
          }}>
            <Input type="date"/>
          </Form.Item>
        </Form>
        <div className='btn'>
        <Button type="primary" size='large' className='butleft' >查询</Button>
        <Button size='large' className='butright'>重置</Button>
        </div>
      </div>
      <Table
    columns={columns}
    dataSource={data}
    scroll={{
      x: 1100,
    }}
  />
    </div>
  )
}
